<div class="main-section">
    <h1 class="main-section__title">Tooltip</h1>

    <p class="main-section__intro">
        <code>lx-tooltip</code> is a directive that create a tooltip on a target element.
    </p>

    <lx-component lx-title="Basic usage" lx-path="/includes/modules/tooltip/includes/basic.html"></lx-component>

    <lx-component-attributes>
        <table>
            <thead>
                <tr>
                    <th>Parameter</th>
                    <th>Type</th>
                    <th>Default</th>
                    <th>Description</th>
                </tr>
            </thead>

            <tbody>
                <tr>
                    <td>lx-tooltip</td>
                    <td><code>string</code></td>
                    <td></td>
                    <td>The tooltip content.</td>
                </tr>
                <tr>
                    <td>lx-tooltip-position</td>
                    <td><code>string</code></td>
                    <td><code>top</code></td>
                    <td>The tooltip position relative to the target element.</td>
                </tr>
            </tbody>
        </table>
    </lx-component-attributes>
</div>